<template>
    <div class="warp h-100">
        <header>
            <el-card class="box-card-search" shadow="never">
                <div slot="header" class="clearfix">
                    <slot name="search-header"></slot>
                </div>
                <slot name="search"></slot>
            </el-card>

        </header>
        <main>
            <el-card class="box-card-table" shadow="never">
                <div slot="header" class="clearfix">
                    <slot name="table-header"></slot>
                </div>
                <slot name="table"></slot>
            </el-card>
        </main>
    </div>
</template>

<script>

export default {
    name: 'warp',
    components: {
        
    },
}
</script>
<style lang="less">
.warp{
    .el-card__header{
        padding:10px 20px;
    }
    header{
        padding-top:10px;
        .el-form-item{
            margin-bottom:0px;
        }
    }
    main{
        padding-top:20px;
        height:calc(~"100% - 160px");

        .el-card__header{
            line-height: 40px;
        }
        .box-card-table{
            min-height:calc(~"100% - 2px");
        }
    }
}
</style>
